<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/photo.css">
    <link rel="stylesheet" href="../css/bootstrap.min.css">
    <script src="../js/bootstrap.min.js"></script>
    <script src="../js/jquery-3.4.1.min.js"></script>
</head>
<body style="background-color: #f9f7f0;" >
<div style="text-align: center;margin-top: 20px">
    <h1 style="color: #1bb1ff">启明星幼儿园照片墙</h1>
    <button type="button" class="btn btn-primary" style="background: #E5C7AB; border: 0px;margin-top: 20px">
                        <span class="glyphicon glyphicon-plus">
                        </span> 增加相册
    </button>
</div>
<div class="odiv">
<div class="div_pic">
    <div class="row" style="margin-top: 40px">
        <div class="col-sm-3 col-md-3 col-xs-3  col-md-offset-3">
                <p >XXX班</p>
                <img class="p p1" src="../images/children1.jfif">
                <button  type="button" data-toggle="modal" data-target="#oBox" class="btn btn-primary" style="background: #E5C7AB; border: 0px;">
                    <span class="glyphicon glyphicon-pencil"></span>
                </button>
        </div>
        <div class="col-sm-3" class="col-md-3" class="col-xs-3">
            <p>XXX班级</p>
            <img class="p p2" src="../images/children2.jfif">
            <button  type="button" data-toggle="modal" data-target="#oBox" class="btn btn-primary" style="background: #E5C7AB; border: 0px;">
                <span class="glyphicon glyphicon-pencil"></span>
            </button>
        </div>
        <div class="col-sm-3" class="col-md-3" class="col-xs-3">
            <p>XXX班级</p>
            <img class="p p3" src="../images/children3.jfif">
            <button  type="button" data-toggle="modal" data-target="#oBox" class="btn btn-primary" style="background: #E5C7AB; border: 0px;">
                <span class="glyphicon glyphicon-pencil"></span>
            </button>
        </div>
    </div>
    <div class="row" style="margin-top: 40px">
        <div class="col-sm-3 col-md-3 col-xs-3 col-md-offset-3">
            <p>XXX班级</p>
            <img class="p p4" src="../images/children4.jpg">
            <button  type="button" data-toggle="modal" data-target="#oBox" class="btn btn-primary" style="background: #E5C7AB; border: 0px;">
                <span class="glyphicon glyphicon-pencil"></span>
            </button>
        </div>
        <div class="col-sm-3" class="col-md-3" class="col-xs-3">
            <p>XXX班级</p>
            <img class="p p5" src="../images/children5.jpg">
            <button  type="button" data-toggle="modal" data-target="#oBox" class="btn btn-primary" style="background: #E5C7AB; border: 0px;">
                <span class="glyphicon glyphicon-pencil"></span>
            </button>
        </div>
        <div class="col-sm-3" class="col-md-3" class="col-xs-3">
            <p>XXX班级</p>
            <img class="p p6" src="../images/children6.jpg">
            <button  type="button" data-toggle="modal" data-target="#oBox" class="btn btn-primary" style="background: #E5C7AB; border: 0px;">
                <span class="glyphicon glyphicon-pencil"></span>
            </button>
        </div>
    </div>
    <div class="row" style="margin-top: 40px">
        <div class="col-sm-3 col-md-3 col-xs-3 col-md-offset-3">
            <p>XXX班级</p>
            <img class="p p6" src="../images/children7.jpg">
            <button  type="button" data-toggle="modal" data-target="#oBox" class="btn btn-primary" style="background: #E5C7AB; border: 0px;">
                <span class="glyphicon glyphicon-pencil"></span>
            </button>
        </div>
        <div class="col-sm-3" class="col-md-3" class="col-xs-3">
            <p>XXX班级</p>
            <img class="p p8" src="../images/children8.jpg">
            <button  type="button" data-toggle="modal" data-target="#oBox" class="btn btn-primary" style="background: #E5C7AB; border: 0px;">
                <span class="glyphicon glyphicon-pencil"></span>
            </button>
        </div>
        <div class="col-sm-3" class="col-md-3" class="col-xs-3">
            <p>XXX班级</p>
            <img class="p p9" src="../images/children9.jpg">
            <button  type="button" data-toggle="modal" data-target="#oBox" class="btn btn-primary" style="background: #E5C7AB; border: 0px;">
                <span class="glyphicon glyphicon-pencil"></span>
            </button>
        </div>
    </div>
</div>
</div>
</body>
</html>